<template xmlns="http://www.w3.org/1999/html">

    <sea-form :model="form_data" :rules="form_rules"
              :succeed="props.succeed" :submit=" role.create">
        <el-form-item label="授权码" prop="authorityCode">
            <el-input v-model="form_data.authorityCode" placeholder="授权码"></el-input>
        </el-form-item>
        <el-form-item label="角色名称" prop="roleName">
            <el-input v-model="form_data.roleName" placeholder="角色名称"></el-input>
        </el-form-item>
        <el-form-item label="角色图标" prop="roleIcon">
            <el-input v-model="form_data.roleIcon" placeholder="角色图标"></el-input>
        </el-form-item>
        <el-form-item label="是否可用" prop="disabled">
            <el-switch v-model="form_data.disabled" placeholder="是否可用"></el-switch>
        </el-form-item>
        <el-form-item label="是否可编辑" prop="editable">
            <el-switch v-model="form_data.editable" placeholder="是否可编辑"></el-switch>
        </el-form-item>
        <el-form-item label="描述" prop="description">
            <el-input v-model="form_data.description" placeholder="描述" type="textarea"></el-input>
        </el-form-item>
    </sea-form>
</template>

<script setup lang="ts">
import role from "./role.ts";
import {reactive} from "vue";

/**
 * 创建页面
 */
const props = defineProps({
    // 成功回调，通常是刷新数据表格
    succeed: {type: Function, default: undefined}
})


const form_data = reactive(role.formModel());

const form_rules = reactive(role.formRules);
</script>
